<h4>最近30天的订单统计</h4>
<canvas id="order_chart" style="min-height: 400px;width: 100%">
</canvas>

<script>
  $(function(){
    var orders_list = <%= @order_charts.to_json.html_safe %>
    var labels = []
    var totalCounts = []
    var colors = []

    orders_list.forEach(function(item){
      labels.push(item.sell_date)
      totalCounts.push(item.day_count)
    })
    var quantityEle = document.getElementById('order_chart')
    var quantityData = new Chart(quantityEle, {
      type: 'line',
      labels: labels,
      options: {
          scales: {
            yAxes: [{
              scaleLabel: {
                display: true,
                labelString: '份数'
              }
            }]
          }
      },
      data: {
        labels: labels,
        datasets: [{
           label: '订单数量',
           fill: false,
            backgroundColor: "rgba(75,192,192,0.4)",
            borderColor: "rgba(75,192,192,1)",
           data: totalCounts,
            borderCapStyle: 'butt',
            lineTension: 0.1,
            borderDashOffset: 0.0,
            borderJoinStyle: 'miter',
            pointBorderWidth: 1,
          pointHoverRadius: 5,
        }]
      }
    })

    function rgb(){
      var r=Math.floor(Math.random()*255);
      var g=Math.floor(Math.random()*255);
      var b=Math.floor(Math.random()*255);
      var rgb='rgba('+r+','+g+','+b+', 0.2)';
      return rgb;
    }
  })
</script>
